<template>
	<!-- 航班列表 -->
	<view class="wrap">
		<u-navbar :placeholder="true" title="航班信息" @leftClick="goTab('/pages/homePage/index')">
		</u-navbar>
		<view class="wrap_box">
			<view class="header">
				<u-tabs :list="tabList" @change="changeTab" lineWidth="30" lineColor="#144ea2"></u-tabs>
				<view class="search">
					<u--input placeholder="请输入航班号" prefixIcon="search" border="none" @change="changeInput"></u--input>

					<u-button @click="show = true" type="text" class="btn">请选择日期
						<image src="@/static/images/icon/Calendar.png" class="img"></image>
					</u-button>
				</view>
			</view>

			<view class="card">
				<u-swipe-action>
					<!--  -->
					<u-swipe-action-item v-for="(item) in flightList" :key="item.id"
						:options="item.isBind =='1'? options:options2" autoClose @click='clickSwipe(item,$event)'>
						<view class="swipe-action">
							<view class="swipe-action__content">
								<flight-item :form="item" @gofilghtDetail="gofilghtDetail"
									:infoAirline="item.infoAirline" isFlight="true" />
							</view>
						</view>
					</u-swipe-action-item>
				</u-swipe-action>
			</view>
			<u-calendar :show="show" @confirm="confirm" @close="close"></u-calendar>
		</view>
	</view>
</template>

<script>
	import {
		getAction,
		postAction,
		httpAction,
		deleteAction
	} from "@/api/manage";

	export default {
		data() {
			return {
				options: [{
					text: '编辑单据',
					style: {
						backgroundColor: '#ee7b30'
					}
				}, {
					text: '航班详情',
					style: {
						backgroundColor: '#134ea3'
					}
				}],
				options2: [{
					text: '航班详情',
					style: {
						backgroundColor: '#134ea3'
					}
				}],
				tabList: [{
						name: '进港',
					},
					{
						name: '出港',
					},
				],
				params: {
					flightKind: '进港',
				},
				show: false,
				flightList: [],
				loading: false,
				urls: {
					list: '/billFlight/flight/list',
					signlist: '/system/receipt/list',

				},
			}
		},
		onLoad: function() {
			this.loadData()
		},
		onShow:function() {
			this.loadData()
		},
		methods: {
			gofilghtDetail() {},
			async clickSwipe(item, val) {

				let {
					index
				} = val
				if (index == 1 || item.isBind =='0') {
					// 前往航班详情
					this.$store.commit("GETFLIGHTINFO", item);
					console.log(item);
					this.$tab.navigateTo('/pages/flight/flightDetail');
				} else if (index == 0) {
					// 前往订单详情
					let {
						data
					} = await getAction(this.urls.signlist, {
						flightId: item.id
					});
					if (data.records.length > 0) {
						data.records.forEach(item => {
							item.billInfo = JSON.parse(item.billInfo);
							item.billInfo.tasks.forEach(val => {
								val.options.forEach(val2 => {
									if (val2.optionValue == true)
										val.value = val2.elementName;
								});
							});
						});
						this.$store.commit("GETBILLINFO", data.records[0]);
						this.$tab.navigateTo('/pages/signBill/billDetail')
					} else {
						uni.showToast({
							title: '未创建签单',
							icon: 'none'
						})
					}
				}
			},
			// 加载航班数据
			loadData() {
				this.loading = true;
				getAction(this.urls.list, this.params).then((res) => {
					if (res.code == 200) {
						this.loading = false;

						res.data.records.forEach(item => {
							let list = ['inRealTime', 'inExpectedTime', 'inPlanTime',
								'boardEndTime', 'boardStartTime',
								'checkStartTime', 'checkEndTime',
								'preRealTime', 'preTakeoffTime',
								'folLandTime', 'folRealTime',
								'outExpectedTime', 'outRealTime', 'outPlanTime',
							]
							list.forEach(val => {
								if (item[val] != undefined)
									item[val] = item[val].replace(/^.*\s(\d{2}:\d{2}):\d{2}$/,
										'$1');
							})
							if (item.inDate != undefined)
								item.inDate = item.inDate.replace(/^(\d{4}-\d{2}-\d{2}).*$/, '$1');
							if (item.outDate != undefined)
								item.outDate = item.outDate.replace(/^(\d{4}-\d{2}-\d{2}).*$/, '$1');

						});

						this.flightList = res.data.records
						// this.$modal.msgSuccess(res.msg)
					} else {
						this.loading = false;
						// this.$message.warning(res.msg);
						// this.$modal.msgError(res.msg)
					}
				});
			},


			// 标签切换
			changeTab(val) {
				this.params.flightKind = val.name
				this.loadData(this.params)
			},
			// 输入框监听
			changeInput() {},
			// 时间筛选
			confirm() {
				this.show = false
			},
			close() {
				this.show = false
			},

		}
	}
</script>

<style lang="scss" scoped>
	.header {
		background-color: #fff;
		max-height: 20%;
		margin-bottom: 10px;

		::v-deep .u-tabs__wrapper__nav__item {
			width: 50%;
		}

		.search {
			display: flex;
			padding: 10px 0;
			width: 85%;
			margin: 0 auto 10px;
			justify-content: center;

			.img {
				margin-left: 10px;
				width: 20px;
				height: 20px
			}

			::v-deep .u-input {
				background-color: #f5f5f5;
				width: 35%;
				border-radius: 20px !important;
				padding: 2px 10px !important;
			}

			.btn {
				width: 45%;
			}
		}
	}

	::v-deep .u-swipe-action-item__right__button {
		border-radius: 0 20px 20px 0;
		padding: 2px;
	}
</style>